<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    /*
      1. let和const
      let用于创建变量，const用于创建常量
      let和const具有局部作用域，而var是全局作用域
      let和const不会有变量提升，必须先定义再使用，而var有变量提升

      六种定义变量的方式：
      var let const function class import
    */ 



    /*
      2. 解构赋值
      ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构
      场景：
        数据请求完以后，拿到想要的值
        模块化引入的时候，比如 import {b, c} from "./a.js";
        函数参数也可以使用解构


      对象的解构:
        const obj = {
          name: "zhangsan",
          age: 20,
        }
        const age = obj.age;
        const { name: name, age } = obj; // 解构赋值
        console.log(name, age);

        const name2 = obj.name;
        const {name: name2} = obj; // 赋值以后重新取名的语法
        console.log(name2);

        const fn = ({a, b}) => {
          console.log(a);
          console.log(b);
        }
        fn({a: 3, b: 4, c: 5, d: 6})

        const obj = {
          a: 3,
          b: {
            x: 10,
            y: 20,
          }
        }
        const {b: {x}} = obj; // 还可以做二次解构
        console.log(x);


      数组的解构
        语法上来说和对象几乎一样

        const arr = [1,2,3,4,5];
        const [a,b,c] = arr;
        console.log(a,b,c); // 数组的解构是按照顺序进行解构的

        let m = 10;
        let n = 20;
        [m, n] = [n, m];
        console.log(m, n);
    */ 
    
    
    
    
    
    
    
  </script>
</body>
</html>